<html xmlns="http://www.w3.org/1999/xhtml" xmlns:c="http://java.sun.com/jstl/core" 
      xmlns:f="http://java.sun.com/jsf/core" xmlns:h="http://java.sun.com/jsf/html" 
      xmlns:ui="http://java.sun.com/jsf/facelets" xmlns:t="http://myfaces.apache.org/tomahawk"
      xmlns:v="http://shale.apache.org/validator">

<f:view>
<f:loadBundle var="text" basename="#{signupForm.bundleName}"/>
<head>
    <title>#{text['signup.title']}</title>
    <meta name="heading" content="#{text['signup.heading']}"/>
</head>
<body id="signup">

<h:form id="signupForm" onsubmit="return validateSignupForm(this)">

<h2>#{text['user.form.header.login.credentials']}</h2>
	<table class="inputFieldsTable">
		<tr>
			<td class="inputLabelColumn"><h:outputLabel for="username" styleClass="desc" value="#{text['user.username']}"/></td>
			<td>
				<h:inputText value="#{signupForm.user.username}" id="username" required="true" styleClass="text medium">
					<v:commonsValidator client="true" type="required" arg="#{text['user.username']}"/>
				</h:inputText>
			</td>
			<td><t:message for="username" styleClass="fieldError"/></td>
		</tr>
		<c:if test="${!userForm.rememberMe}">
			<tr>
				<td><h:outputLabel for="password" value="#{text['user.password']}" styleClass="desc"/></td>
				<td><h:inputSecret value="#{signupForm.user.password}" id="password" redisplay="true" required="true" styleClass="text medium">
						<v:commonsValidator client="true" type="required" arg="#{text['user.password']}"/>
					</h:inputSecret></td>
				<td><t:message for="password" styleClass="fieldError"/></td>
			</tr>
			<tr>
				<td><h:outputLabel for="confirmPassword" value="#{text['user.confirmPassword']}" styleClass="desc"/></td>
				<td><h:inputSecret value="#{signupForm.user.confirmPassword}" id="confirmPassword" redisplay="true" required="true" styleClass="text medium">
						<v:commonsValidator client="true" type="required" arg="#{text['user.confirmPassword']}"/>
						<t:validateEqual for="password" client="true" message="#{text['errors.password.not.match']}"/>
					</h:inputSecret></td>
				<td><t:message for="confirmPassword" styleClass="fieldError"/></td>
			</tr>
		</c:if>
		<!--tr>
			<td><h:outputLabel for="passwordHint" value="#{text['user.passwordHint']}" styleClass="desc"/></td>
			<td><h:inputText value="#{signupForm.user.passwordHint}" id="passwordHint" required="true" styleClass="text medium">
					<v:commonsValidator client="true" type="required" arg="#{text['user.passwordHint']}"/>
				</h:inputText></td>
			<td><t:message for="passwordHint" styleClass="fieldError"/></td>
		</tr-->
	</table>
		
		
		

	<h2>#{text['user.form.header.personal.info']}</h2>
	<table class="inputFieldsTable">
		<tr>
			<td class="inputLabelColumn"><h:outputLabel for="firstName" value="#{text['user.firstName']}" styleClass="desc"/></td>
			<td>
				<h:inputText id="firstName" value="#{signupForm.user.firstName}" maxlength="50" required="true" styleClass="text medium">
					<v:commonsValidator client="true" type="required" arg="#{text['user.firstName']}"/>
				</h:inputText>			</td>
			<td><t:message for="firstName" styleClass="fieldError"/></td>
		</tr>
		<tr>
			<td><h:outputLabel for="lastName" value="#{text['user.lastName']}" styleClass="desc"/></td>
			<td>
				<h:inputText value="#{signupForm.user.lastName}" id="lastName" maxlength="50" required="true" styleClass="text medium">
					<v:commonsValidator client="true" type="required" arg="#{text['user.lastName']}"/>
				</h:inputText></td>
			<td><t:message for="lastName" styleClass="fieldError"/></td>
		</tr>
		<tr>
			<td><h:outputLabel for="email" value="#{text['user.email']}" styleClass="desc"/></td>
			<td>
				<h:inputText value="#{signupForm.user.email}" id="email" required="true" styleClass="text medium">
					<f:validator validatorId="org.apache.myfaces.validator.Email"/>
					<v:commonsValidator client="true" type="required" arg="#{text['user.email']}"/>
					<v:commonsValidator client="true" type="email" arg="#{text['user.email']}"/>
				</h:inputText></td>
			<td><t:message for="email" styleClass="fieldError"/></td>
		</tr>
		<tr>
			<td><h:outputLabel for="phoneNumber" value="#{text['user.phoneNumber']}" styleClass="desc"/></td>
			<td><h:inputText value="#{signupForm.user.phoneNumber}" id="phoneNumber" styleClass="text medium"/></td>
			<td><t:message for="phoneNumber" styleClass="fieldError"/></td>
		</tr>
		<tr>
			<td><h:outputLabel for="country" value="#{text['user.address.country']}"  styleClass="desc"/></td>
			<td><h:selectOneMenu value="#{signupForm.country}" id="country" required="true" styleClass="select">
				<f:selectItems value="#{signupForm.countries}"/>
					<v:commonsValidator client="true" type="required" arg="#{text['user.address.country']}"/>
				</h:selectOneMenu>
			</td>
			<td> <t:message for="country" styleClass="fieldError"/></td>
		</tr>

	</table>
		
    <h:panelGroup styleClass="buttonBar bottom">
        <h:commandButton value="#{text['button.register']}" action="#{signupForm.save}" id="save" styleClass="button_small"/>
        <h:commandButton value="#{text['button.cancel']}" action="cancel" immediate="true" id="cancel" styleClass="button_small" onclick="bCancel=true"/>
    </h:panelGroup>
</h:form>

<v:validatorScript functionName="validateSignupForm"/>

<script type="text/javascript">
    Form.focusFirstElement($('signupForm'));
</script>
</body>
</f:view>
</html>
